<!DOCTYPE HTML>
<html data-view-directly-accessible = "true">
<head>
	<meta charset = "utf-8" />
	<meta name = "format-detection" content = "telephone = no" />
	<meta name = "msapplication-tap-highlight" content = "no" />
	<meta name = "viewport" content = "user-scalable = no, initial-scale = 1, maximum-scale = 1, minimum-scale = 1, width = device-width" />
	
	<!-- build:css css/attr.html.allinone.css -->
	<link rel = "stylesheet" href="js/lib/view/view.css"/>
	<link rel = "stylesheet" href="css/attr.css"/>
	<!-- endbuild -->
</head>
<body>
<section id = "attr_data-view" data-view = "true" data-view-title = "data-view">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view</div>
		<div class = "attr-usage">声明特定的DOM元素为视图。一个视图必须有一个DOM元素与之对应，且DOM元素的id即为视图的编号。尝试通过API：<span class = "code js">View.ofId(viewId)</span>获取一个没有DOM元素与之对应的视图时，View.js将会报错。</div>
		<div class = "attr-value"><span class = "code js no-margin">true</span></div>
		<div class = "attr-declare-position">任一DOM节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-container" data-view = "true" data-view-title = "data-view-container">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-container</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-container</div>
		<div class = "attr-usage">用于指明所有视图所隶属的视图容器（视图DOM元素的父元素）。如果没有元素声明该属性，则认定document.body为视图容器。</div>
		<div class = "attr-value">true</div>
		<div class = "attr-declare-position">任一非视图节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-directly-accessible" data-view = "true" data-view-title = "data-view-directly-accessible">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-directly-accessible</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-directly-accessible</div>
		<div class = "attr-usage">配置视图是否可以直接访问。一个视图是否能够直接访问（直接访问，是指是否允许用户以手动更改地址栏中地址的方式主动访问特定视图）</div>
		<div class = "attr-value"><span class = "code js no-margin">true</span>：可以通过直接访问；<span class = "code js">false</span>：不能直接访问。</div>
		<div class = "attr-declare-position">HTML节点，或任一视图节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-group" data-view = "true" data-view-title = "data-view-group">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-group</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-group</div>
		<div class = "attr-usage">用于指明视图所隶属的视图群组。</div>
		<div class = "attr-value">任意字符串</div>
		<div class = "attr-declare-position">任一视图节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-fallback" data-view = "true" data-view-title = "data-view-fallback">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-fallback</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-fallback</div>
		<div class = "attr-usage">用于指定视图不能直接访问时，将要呈现的回退视图编号。可以指定一个同样不能直接访问的视图，此时将递归搜索，直到找到一个可以直接访问的回退视图。如果搜索链上的所有视图都不能直接访问，则最终呈现默认视图。</div>
		<div class = "attr-value">任一存在的视图编号，亦即对应的DOM元素的ID；或伪视图：<span class = "code html">:default-view</span>；或视图群组：<span class = "code html">~groupName</span></div>
		<div class = "attr-declare-position">任一视图节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-rel-type" data-view = "true" data-view-title = "data-view-rel-type">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-rel-type</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-rel-type</div>
		<div class = "attr-usage">声明通过<span class = "code html">data-view-rel</span>属性切换视图时使用的视图切换类型。</div>
		<div class = "attr-value"><span class = "code html no-margin">nav</span>：以"压入历史堆栈"的方式切换；<span class = "code html">change</span>：以"替换当前堆栈"的方式切换</div>
		<div class = "attr-declare-position">任一声明了<span class = "code html">data-view-rel</span>属性的DOM节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-rel-disabled" data-view = "true" data-view-title = "data-view-rel-disabled">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-rel-disabled</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-rel-disabled</div>
		<div class = "attr-usage">禁用触摸跳转。设置为true后，声明了data-view-rel属性的节点将无法响应用户的触摸操作。</div>
		<div class = "attr-value"><span class = "code js no-margin">true</span>：禁止跳转；<span class = "code js">false</span>：允许跳转</div>
		<div class = "attr-declare-position">任一声明了<span class = "code html">data-view-rel</span>属性的DOM节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-rel" data-view = "true" data-view-title = "data-view-rel">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-rel</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-rel</div>
		<div class = "attr-usage">响应用户触摸，跳转到指定的目标位置。支持伪视图和视图群组。支持视图选项，如：<span class = "code html">&lt;span data-view-rel=”category!id=1”&gt;分类&lt;/span&gt;</span></div>
		<div class = "attr-value">
			<ul>
				<li>任一存在的视图编号，亦即对应的DOM元素的ID；</li>
				<li>伪视图：":back"（后退），":forward"（前进），":default-view"（默认视图）</li>
				<li>视图群组</li>
				<li>其它链接</li>
			</ul>
			<p>当配置为视图群组时，需要添加特殊符号：“~”，如：<span class = "code html">&lt;span data-view-rel="~category"&gt;分类&lt;/span&gt;</span>。</p>
			<p>当取值为视图编号，或视图群组时，开发者可以使用”!”作为分隔符传递参数。如：<span class = "code">&lt;span data-view-rel=”category!id=1”&gt;分类&lt;/span&gt; &lt;span data-view-rel=”~category!id=1&name=XXXX”&gt;分类&lt;/span&gt;</span>。多个参数之间使用符号：“&”分隔。</p>
			<p>当配置为其它链接地址时，需要添加特殊符号：“@”，如：<span class = "code html">&lt;span data-view-rel="@index.html"&gt;首页&lt;/span&gt;</span></p>
		</div>
		<div class = "attr-declare-position">任一DOM节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-title" data-view = "true" data-view-title = "data-view-title">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-title</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-title</div>
		<div class = "attr-usage">用于声明视图标题。声明了视图标题的视图在进入时，View.js将使用视图标题更新文档标题。</div>
		<div class = "attr-value">任意字符串</div>
		<div class = "attr-declare-position">任一视图节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-default" data-view = "true" data-view-title = "data-view-default">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-default</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-default</div>
		<div class = "attr-usage">标明特定视图为默认视图。默认视图是指页面打开后将要呈现的第一个视图。如果没有指定默认视图，则最终呈现DOM顺序上的第一个视图。</div>
		<div class = "attr-value"><span class = "code js no-margin">true</span></div>
		<div class = "attr-declare-position">任一视图节点（声明了<span class = "code html">data-view</span>属性，且取值为<span class = "code js">true</span>的DOM节点）</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>
<section id = "attr_data-view-os" data-view = "true" data-view-title = "data-view-os">
	<header>
		<a class = "nav-back" data-view-rel = ":back"></a>
		<span>data-view-os</span>
		<a class = "menu"></a>
	</header>
	<div class = "body">
		<div class = "attr-name">data-view-os</div>
		<div class = "attr-usage">该属性由View.js自动附加，代表当前用户使用的设备的类型等</div>
		<div class = "attr-value"><span class = "code js no-margin">android</span>：安卓操作系统；<span class = "code js">ios</span>：苹果操作系统</div>
		<div class = "attr-declare-position">HTML节点</div>
	</div>
	<footer><div class = "btn next">下一节</div></footer>
</section>

	<!-- build:js attr.html.allinone.js -->
	<script type = "text/javascript" src = "js/lib/view/view.1.6.0-B201812071500.min.js"></script>
	<script type = "text/javascript" src = "js/lib/hammer.min.js"></script>

	<script type = "text/javascript" src = "js/page/define.version.js"></script>
	<script type = "text/javascript" src = "js/page/init.layout.js"></script>
	<script type = "text/javascript" src = "js/page/animation.js"></script>

	<script type = "text/javascript" src = "js/page/attr/init.generate-menu.js"></script>
	<!-- endbuild -->
</body>
</html>